<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="../../../css/app.css">
    <link rel="stylesheet" type="text/css" href="../../../css/tabBar.css">
    <link rel="stylesheet" type="text/css" href="../comm/buy_comm.css"/>
    <link rel="stylesheet" type="text/css" href="../comm/xy-pop.css"/>
    <link rel="stylesheet" type="text/css" href="../shop_order/shop_order.css"/>
    <link rel="stylesheet" type="text/css" href="../buy_refund/css/refund_apply.css"/>
    <link rel="stylesheet" type="text/css" href="./css/order_my.css">
    <title>我的订单</title>
    <style type="text/css">
    	.container.top-container{
    		padding-top: 3rem !important;
    	}
    	.order-my-list{
    		padding-top: 2.5rem !important;
    	}
    	#orderSearch{
    		padding: 5px 10px;margin: -8px -10px 0 0;
    	}
    	#orderSearch img{
    		width: 20px;
    	}
    	.order_yzc{
    		width: 22px;display: inline-block;margin: -2px 0 0 -2px;vertical-align: middle;
    	}
    </style>
</head>

<body>
	<div class="header navigationBar">
      	<div class="wrapper">
          	<span id="btn-back" class="header-btn left-btn backtrack"></span>
          	<span class="title">我的订单</span>
          	<span class="right-btn" id="orderSearch"><img src="../../../image/search.png"/></span>
      	</div>
  	</div>
  	<div class="container top-container" v-cloak>
  		<div class="order-my-null" style="display: none;" id="orderMyNull">
  			<img src="../../../image/shop/buy/buy-76.png"/>
  			<h2>你还没有相关订单</h2>
  			<p>要是宝贝到手了，那就赶紧享用吧</p>
  		</div>
  		<ul class="order-my-tab">
  			<li :class="tabIndex == index ? 'active' : ''" v-for="(item,index) in tabTxt" :data-index="index" @click="orderMyTab" v-html="item"></li>
  		</ul>
  		<ul class="order-my-list shop_order_list" ref="orderMyList" id="orderMyList" v-if="list.length > 0">
  			<li v-for="(item,index) in list" :data-orderid="item.id" :class="item.group_buying == 1 ? 'order-my-group' : ''">
  				<div class="order_list_buyer">
  					<u @click="toShop(index)">
  						<img src="../../../image/shop/buy/buy-17.png"/><span v-html="item.shop_name">天叶蓝的店铺</span>
  						<img src="../../../image/shop/buy/buy-23.png" /><br />
  						<!--<p v-html="'订单编号：'+item.order_sn+''">2018082118302210156525</p>-->
  					</u>
  					<div>
						<span v-html="item.order_sn">2018082118302210156525</span>
  						<i v-if="item.order_state == 2 && item.group_buying == 1 && item.group_status == 0">待成团</i>
  						<i v-else="" v-html="item.order_state_msg"></i>
  					</div>
  				</div>
  				<div class="order_list_box" v-for="goods in item.goods" :data-orderid="item.id" :data-goodsid="goods.goods_id"
  					@click="goOrderDetail" :data-group="item.group_buying" :data-optionid="goods.option_id" :data-quantity="goods.quantity">
  					<div class="order_list_img">
	  					<img :src="goods.goods_image+'?x-oss-process=image/resize,m_lfit,w_960'"/>
	    			</div>
	    			<div class="order_list_info">
	    				<h2 v-html="goods.goods_name"></h2>
	    				<p>
	    					<img v-if="item.yzc_status == 1" src="../../../image/shop/yzc_icon.png" class="order_yzc" />
	    					<span v-html="item.yzc_status == 1 ? goods.price : '¥'+goods.price"></span>
	    				</p>
	    				<p v-html="'型号：'+goods.option_name" style="font-size: 12px;line-height: 20px;margin-top: 10px;"></p>
	    				<p v-html="'数量：'+goods.quantity" style="font-size: 12px;line-height: 20px;"></p>
	    				<!--<a href="javascript:void(0);" @click="goRefundApply" data-mod="quit">申请退款</a>-->
	    			</div>
  				</div>
  				<div class="order_list_money">
  					<div v-if="item.group_buying == 1">
  						<i></i>
  						<img :src="group.avater" v-for="group in item.group_user"/>
  					</div>
  					<span>实付：</span>
            <span v-if="item.yzc_status == 1 && item.express_amount!='0.00'" v-html="'¥'+item.express_amount+' + '"></span>
            <img v-if="item.yzc_status == 1" src="../../../image/shop/yzc_icon.png" style="margin-top: -13px;" class="order_yzc" />
  					<span v-html="item.yzc_status == 1 ? item.order_amount : '¥'+item.order_amount"></span>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 1" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="cancelOrder" :data-index="index">取消订单</a>
  					<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(item.shop_user)">联系卖家</a> -->
  					<!--<a href="javascript:void(0);" data-mod="send" @click="openShare" v-if="item.group_buying == 1 && item.group_status != 0" :data-groupid="item.group_id" :data-name="item.goods[0].goods_name">邀请好友</a>-->
  					<a href="javascript:void(0);" data-mod="send" data-yzc="item.yzc_status" @click="goPayMent" :data-money="item.order_amount" :data-code="item.pay_key">去付款</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 2" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="goRefundApply" v-if="item.is_member_product!=1">申请退款</a>
  					<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(item.shop_user)">联系卖家</a> -->
  					<a href="javascript:void(0);" @click="remindSend" v-show="item.group_buying == 0 || item.group_status != 0">提醒发货</a>
  					<a href="javascript:void(0);" data-mod="send" @click="openShare" v-if="item.group_buying == 1 && item.group_status != 1" :data-groupid="item.group_id" :data-name="item.goods[0].goods_name" :data-img="item.goods[0].goods_image">邀请好友</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 3" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="goRefundApply" v-if="item.is_member_product!=1">申请退款</a>
  					<a href="javascript:void(0);" @click="viewFlow">查看物流</a>
  					<a href="javascript:void(0);" @click="delayReceipt">延长收货</a>
  					<a href="javascript:void(0);" data-mod="send" @click="sureReceipt">确认收货</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 4" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="goRefundApply" v-if="item.is_member_product!=1">申请退款</a>
  					<!--<a href="javascript:void(0);" @click="buyAgain" :data-yzc="item.yzc_status" :data-index="index" :data-options="item.options != '' ? item.options : ''"
  						 v-html="item.group_buying == 1 ? '发起拼团' : '再次购买'"></a>-->
  					<a href="javascript:void(0);" @click="viewFlow">查看物流</a>
  					<a href="javascript:void(0);" data-mod="send" :data-index="index" @click="buyComment">去评价</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 5" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
  					<a href="javascript:void(0);" @click="goRefundApply" v-if="item.is_member_product!=1">申请退款</a>
  					<!--<a href="javascript:void(0);" @click="buyAgain" :data-yzc="item.yzc_status" :data-index="index" :data-options="item.options != '' ? item.options : ''"
  						v-html="item.group_buying == 1 ? '发起拼团' : '再次购买'"></a>-->
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 6" :data-orderid="item.id" :data-group="list.group_buying">
					<a href="javascript:void(0);" @click="orderDelete">删除订单</a>
				</div>
  				<div class="order_list_btn" v-show="item.order_state == 7" :data-orderid="item.id" :data-group="item.group_buying">
  					<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(item.shop_user)">联系卖家</a> -->
  					<a href="javascript:void(0);" @click="goRefundDetail" :data-id="item.order_return_id">退款详情</a>
  					<a href="javascript:void(0);" data-mod="send" @click="orderRepealRefund" :data-id="item.order_return_id">撤销申请</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 8" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="orderDelete" :data-index="index">删除订单</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 9" :data-orderid="item.id" :data-group="item.group_buying">
  					<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(item.shop_user)">联系卖家</a> -->
  					<a href="javascript:void(0);" @click="goRefundDetail" :data-id="item.order_return_id">退款详情</a>
  					<a href="javascript:void(0);" data-mod="send" @click="orderRepealRefund" :data-id="item.order_return_id">撤销申请</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 10" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="orderDelete" :data-index="index">删除订单</a>
  				</div>
  				<div class="order_list_btn" v-show="item.order_state == 11" :data-orderid="item.id" :data-group="item.group_buying">
  					<a href="javascript:void(0);" @click="orderDelete" :data-index="index">删除订单</a>
  					<!-- <a href="javascript:void(0);" @click="contactSeller" :data-userinfo="JSON.stringify(item.shop_user)">联系卖家</a> -->
  					<a href="javascript:void(0);" @click="goRefundDetail" :data-id="item.order_return_id">退款详情</a>
  				</div>
  			</li>
  		</ul>
  		<div class="refund-apply-question" ref="orderQuestion">
  			<div class="" @click="closeCanelOrder"></div>
  			<section>
  				<h2>取消原因</h2>
	  			<ul ref="orderQuestionUl" :class="is_group ? 'groupChecked' : ''">
	  				<li v-for="(item,index) in cancelList" @click="cancelSelect" :data-index="index">
	  					<span v-html="item.content"></span>
	  					<input type="radio" name="question" class="aui-radio" :checked="cancelChecked == index ? 'checked' : ''" value="" :data-content="item.content" :data-id="item.order_reason_id"/>
	  					<textarea rows="0" v-if="index == (cancelList.length - 1)" cols="0" placeholder="请输入其他原因"></textarea>
	  				</li>
	  			</ul>
  			</section>
  			<a href="javascript:void(0);" class="refund-apply-question-btn"  @click="sureCanelOrder" :style="is_group ? 'background: #f42020;color: #fff;' : ''">确定</a>
  		</div>

  		<div class="order-share-goods" ref="orderSareGroup">
  			<div class="order-share-bg" @click="closeShare"></div>
	      	<div class="order-share-where">
	        	<div @click="shareToWx" data-type="1">
	          		<img src="../../../image/shop/buy/buy-64.png"/>分享给好友
	        	</div>
		        <div @click="shareToWx" data-type="2">
		          	<img src="../../../image/shop/buy/buy-63.png"/>分享到朋友圈
		        </div>
	      	</div>
	    </div>
  	</div>
</body>
<script src="../../sea.js" data-main="../../main"></script>
<script type="text/javascript" src="../../vue.js"></script>
<script type="text/javascript" src="./js/orderMy.js"></script>
</html>
